﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/User.Master" Inherits="System.Web.Mvc.ViewPage<ProductInputModel>" %>
<%@ Import Namespace="SDT.Lib.Helpers" %>
<%@ Import Namespace="SDT.Site.Areas.User.ViewModels" %>
<%@ Import Namespace="SDT.Model"%>
<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
	Thêm mới tin rao bán / cho thuê
</asp:Content>
<asp:Content ID="Content5" ContentPlaceHolderID="Message" runat="server">
<%=ViewData["MessageInfo"]!=null? "<p class='perror'>"+Html.Encode(ViewData["MessageInfo"])+"</p>":string.Empty%> 
</asp:Content>
<asp:Content ID="Content4" ContentPlaceHolderID="Header" runat="server">
Thêm mới tin rao bán / cho thuê
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
 <script src="http://maps.google.com/maps?file=api&amp;v=3&amp;sensor=true&amp;key=<%= Model.GoogleAPI %>" type="text/javascript"></script>
    <%if (ViewData["MessageInfo"] == null)
      { %>
    
    <% using (Html.BeginForm("Create", "Product", FormMethod.Post, new {id = "adminForm",enctype = "multipart/form-data"})){%>    
       <div id="divgooglemap"></div>
    <%= Html.ValidationSummary(true)%>
    
        <fieldset>    
            <legend>Đăng tin rao</legend>
            <table class="admintable" width="100%">
                <tbody>
                    <tr>
                        <td class="key">
                            Loại tin (<font color="red">*</font>)
                        </td>
                        <td>
                            <%=Html.DropDownListFor(m=>m.Product.TypeID, Model.ListType, "-- Loại tin rao --", new { @class="required",style="width:200px" })%>
                        </td>
                    </tr>
                    <tr>
                        <td class="key">
                            Phân mục (<font color="red">*</font>)
                        </td>
                        <td>
                            <%=Html.DropDownListFor(m => m.Product.CatID, new SelectList(Model.Categories, "ID", "Name"), "-- Chuyên mục --", new { @class = "required", style = "width:200px" })%>
                        </td>
                    </tr>
                    <tr>
                        <td class="key">
                            Tỉnh/Thành phố (<font color="red">*</font>)
                        </td>
                        <td>
                            <%=Html.DropDownListFor(m => m.Product.CityID, Model.ListCity, "-- Tỉnh/Thành phố --", new { @class = "required", style = "width:200px" })%>
                        </td>
                    </tr>
                    <tr>
                        <td class="key">
                            Quận/Huyện (<font color="red">*</font>)
                        </td>
                        <td>
                            <%=Html.DropDownListFor(m => m.Product.DistrictID, Model.ListDistrict, "-- Quận/Huyện --", new { @class = "required", style = "width:200px" })%>
                        </td>
                    </tr>
                    <tr>
                        <td class="key">
                            Dự án
                        </td>
                        <td>
                            <%=Html.DropDownListFor(m => m.Product.ProjectID, Model.ListProject, "-- Dự án --", new { style = "width:200px" })%>
                        </td>
                    </tr>
                    <tr>
                        <td class="key">
                            Tiêu đề (<font color="red">*</font>)
                        </td>
                        <td>
                            <%=Html.TextBoxFor(m=>m.Product.Title, new { style = "width: 500px;", @class="required" })%>
                        </td>
                    </tr>
                    <tr>
                        <td class="key">Địa chỉ(<font color="red">*</font>)</td>
                        <td>
                            <%=Html.TextBoxFor(m=>m.Product.Adress, new { style = "width: 500px;", @class="required" })%>
                        </td>
                    </tr>
                    <tr>
                        <td class="key">
                            Nội dung (<font color="red">*</font>)
                        </td>
                        <td>
                            <%=Html.TextAreaFor(m=>m.Product.Summary, new { cols = 90, rows = 15, @class="required",style="width:500px" })%>
                        </td>
                    </tr>
                    <tr>
                        <td class="key">
                            Ảnh đại diện
                        </td>
                        <td>
                            <input type="file" name="ImagePaths" id="ImagePaths" onchange="check_extension(this.value,'btnSave');" />
                        </td>
                    </tr>
                    <tr>
                        <td class="key">
                            Hướng nhà
                        </td>
                        <td>
                            <%=Html.DropDownList("Product.Direction", new SelectList(Model.listProductDirection, "Key", "Value", Model.listProductDirection).ToList(), "--Chọn hướng nhà--", new { style = "width:250px" })%>
                        </td>
                    </tr>
                    <tr>
                        <td class="key">
                            Số tầng
                        </td>
                        <td>
                            <%=Html.TextBoxFor(m=>m.Product.Floors, new { style = "width: 50px; text-align: center;" })%>
                        </td>
                    </tr>
                    <tr>
                        <td class="key">
                            Số phòng
                        </td>
                        <td>
                            <%=Html.TextBoxFor(m=>m.Product.Rooms, new { style = "width: 50px; text-align: center;" })%>
                        </td>
                    </tr>
                    <tr>
                        <td class="key">
                            Giá(<font color="red">*</font>)
                        </td>
                        <td>
                            <%=Html.TextBox("Product.Cost","0", new { style = "width: 100px; text-align: center;", @class = "required" })%>
                            <%=Html.DropDownList("Product.CurrencyID", new SelectList(Model.ListCurrency, "Key", "Value"))%>
                            <%=Html.Hidden("Product.CurrencyName",new SelectList(Model.ListCurrency,"Value","").ToList()) %>
                            <%=Html.DropDownList("Product.UnitCostID",new SelectList(Model.ListUnitCost,"Key","Value").ToList())%>
                            <%=Html.Hidden("Product.UnitCost",new SelectList(Model.ListUnitCost,"Key","")) %>
                        </td>
                    </tr>
                    
                    <tr>
                        <td class="key">
                            Diện tích(<font color="red">*</font>)
                        </td>
                        <td>
                            <%=Html.TextBox("Product.Area","0", new { style = "width: 100px; text-align: center;", @class = "required" })%> m2
                        </td>
                    </tr>
                    <tr>
                        <td class="key">
                            Ảnh Đính kèm
                        </td>
                        <td>
                            <table id="frmFile" width="100%" class="adminlist">
                                
                                <tr>
                                    <td>
                                        <input id="fileInput1" size="25" name="fileInput1" type="file" onchange="check_extension(this.value,'btnSave');" />
                                        &nbsp;<input id="btnAddFile" type="button" value="Thêm" onclick="AddFile();" />
                                    </td>
                                </tr>
                            </table>
                        </td>
                    </tr>
                    <tr>
                        <td class="key">Bản đồ</td>
                        <td>
                            <ul style="margin:0px; padding:0px; list-style-type:none">
                                <li style="float:left; margin-right: 10px; cursor:pointer;" onclick="showMap();"><img src="/Images/icon-32-googlemap.png" style="vertical-align:middle; margin-right:5px" /> Chọn vị trí bản đồ</li>
                                <li onclick="resetMap();" style="cursor:pointer;"><img src="/Images/icon-32-map-hide.png" style="vertical-align:middle; margin-right:5px" />Chọn lại vị trí</li>
                            </ul>
                            <div id="divMap">
                                 <div id="maps" onunload="GUnload()">
                                    <div class="map">
                                        <div id="map_canvas" style="width: 100%; height: 400px; padding-bottom: 10px; position: relative;">
                                        </div>
                                        <p style="display: none" id="idHoanTat">
                                                    <img src="/images/ico_map_check.gif" width="22" height="22" alt="" />&nbsp;Vị
                                                    trí tài sản đã được cập nhật !</p>
                                        <p>
                                            <table width="100%" border="0" cellspacing="0" cellpadding="0">
                                                <tr>
                                                    <td width="9%">
                                                        <img src="/images/ico_map_help.gif" width="36" height="44" alt="" />
                                                    </td>
                                                    <td width="91%">
                                                        Sử dụng con trỏ chuột di chuyển icon (<img src="/Images/icon-google-maker.png" width="20" alt="" />
                                                        ) đến vị trí của tài sản trên bản đồ để cập nhật vị trí cho tài sản.
                                                    </td>
                                                </tr>
                                            </table>
                                        </p>
                                    </div>
                                    <script type="text/javascript">
                                        $('#divMap').toggle(false);
                                        function showMap() {
                                            $('#divMap').toggle();
                                            initialize();
                                            showAddress();

                                        }
                                        function resetMap() {
                                            $("#divMap").show();
                                            initialize();
                                            showAddress();
                                            document.getElementById("Product_Latitube").value = "";
                                            document.getElementById("Product_Longitude").value = "";
                                        }
                                    </script>
                                    <script type="text/javascript">
                                        var map = null;
                                        var geocoder = null;
                                        function initialize() {
                                            if (GBrowserIsCompatible()) {
                                                map = new GMap2(document.getElementById("map_canvas"));
                                                map.setCenter(new GLatLng(21.033, 105.850), 15);
                                                map.setUIToDefault();
                                                geocoder = new GClientGeocoder();
                                                var marker = new GMarker(new GLatLng(21.033, 105.850), { draggable: true });

                                                //Draggable marker
                                                GEvent.addListener(marker, "dragstart", function() {
                                                    map.closeInfoWindow();
                                                });
                                                GEvent.addListener(marker, "dragend", function() {

                                                    //marker.openInfoWindowHtml("aaaaa"+ marker.getLatLng());
                                                    document.getElementById("Product_Latitube").value = marker.getLatLng().lat();
                                                    document.getElementById("Product_Longitude").value = marker.getLatLng().lng();
                                                });
                                                map.addOverlay(marker);
                                            }
                                        }

                                        function showAddress() {
                                            var lat, lng;
                                            lat = document.getElementById("Product_Latitube").value;
                                            lng = document.getElementById("Product_Longitude").value;

                                            if (lat == '' && lng == '' || lat == 0 && lng == 0) {
                                                map.clearOverlays();
                                                map.setCenter(new GLatLng(21.033, 105.850), 15);
                                                var marker = new GMarker(new GLatLng(21.033, 105.850), { draggable: true });

                                                document.getElementById("Product_Latitube").value = marker.getLatLng().lat();
                                                document.getElementById("Product_Longitude").value = marker.getLatLng().lng();

                                                // alert(marker.getLatLng().lat() + " 11 " + marker.getLatLng().lng());
                                                //Draggable marker
                                                GEvent.addListener(marker, "dragstart", function() {
                                                    map.closeInfoWindow();
                                                });
                                                GEvent.addListener(marker, "dragend", function() {
                                                    document.getElementById("Product_Latitube").value = marker.getLatLng().lat();
                                                    document.getElementById("Product_Longitude").value = marker.getLatLng().lng();

                                                    //alert(marker.getLatLng().lat() + " 22 " + marker.getLatLng().lng());
                                                });
                                                map.addOverlay(marker);
                                            }
                                            else {
                                                map.clearOverlays();
                                                map.setCenter(new GLatLng(lat, lng), 15);
                                                var marker = new GMarker(new GLatLng(lat, lng), { draggable: true });
                                                document.getElementById("Product_Latitube").value = marker.getLatLng().lat();
                                                document.getElementById("Product_Longitude").value = marker.getLatLng().lng();

                                                // alert(marker.getLatLng().lat() + " 33 " + marker.getLatLng().lng());
                                                //Draggable marker
                                                GEvent.addListener(marker, "dragstart", function() {
                                                    map.closeInfoWindow();
                                                });
                                                GEvent.addListener(marker, "dragend", function() {

                                                    //marker.openInfoWindowHtml("aaaaa"+ marker.getLatLng());
                                                    document.getElementById("Product_Latitube").value = marker.getLatLng().lat();
                                                    document.getElementById("Product_Longitude").value = marker.getLatLng().lng();

                                                    //   alert(marker.getLatLng().lat() + " 44 " + marker.getLatLng().lng());

                                                });
                                                map.addOverlay(marker);
                                            }

                                        }
                                        function LocationFinished() {
                                            // window.opener.document.getElementById("Product_Latitube").value = document.getElementById("Product_Latitube").value;
                                            //window.opener.document.getElementById("Product_Longitude").value = document.getElementById("Product_Longitude").value;
                                            //document.getElementById("lat").value = document.getElementById("Product_Latitube").value;
                                            // document.getElementById("log").value = document.getElementById("Product_Longitude").value;
                                            //alert(document.getElementById("lat").value);
                                            document.getElementById("idHoanTat").style.display = "block";

                                        }
                                        function LocationFinishedClose() {
                                            // window.opener.document.getElementById("Product_Latitube").value = document.getElementById("Product_Latitube").value;
                                            // window.opener.document.getElementById("Product_Longitude").value = document.getElementById("Product_Longitude").value;
                                            //window.close();
                                        }
                                    </script>

                                </div>
                            </div>
                        </td>
                    </tr>
                    <tr>
                        <td class="key">
                            Ngày hết hạn (<font color="red">*</font>)
                        </td>
                        <td>
                            <%=Html.DropDownList("ExpireDateTime", new SelectList(Model.listProductExpire, "Key", "Value").ToList(), "-- Ngày hết hạn --", new {@class="required", style="width:250px"})%>
                        </td>
                    </tr>
                   </tbody>
            </table>
            </fieldset> 
            <fieldset>    
            <legend>Thông tin liên hệ</legend>
            <table>
                <tbody>
                   	<%
                     var p = UserProfile.GetUserProfile(); 
                   //var pe = UserProfile.GetCurrentUser();
                    string email = p.Email;
                    string name = p.FullName;
                    string Address = p.Address;
                    string Companys = p.Company;
                    string NicSkype = p.NicSkype;
                    string Phone = p.Phone;
                    string NicYahoo = p.NicYahoo;
                    //string NicMSN = "";
                     //foreach (var item in pe)
                     //{
                     //    if (item.ToString().Contains("@"))
                     //    {
                     //        email = item.ToString();
                     //    }
                     //    else name = item.ToString();
                     //}
           %>
					<tr>
						<td class="key">Họ tên:</td>
						<td style ="padding:5px;">
							<%=Html.TextBox("Product.ContactName",name,new {style = "width: 200px; height:20px;"})%>
						</td>
						<td class="key">Email:</td>
						<td style ="padding:5px;">
							<%=Html.TextBox("Product.ContactEmail",email, new { style = "width: 200px; height:20px;" })%>
						</td>
					</tr>
					<tr>
						<td class="key">Mobile:</td>
						<td style ="padding:5px;">
							<%=Html.TextBox("Product.ContactMobile",Phone,new { style = "width: 200px; height:20px;" })%>
						</td>
						<td class="key">Yahoo:</td>
						<td style ="padding:5px;">
							<%=Html.TextBox("Product.ContactYahoo",NicYahoo, new { style = "width: 200px; height:20px;" })%>
						</td>
					</tr>
					<tr>
						<td class="key">MSN:</td>
						<td style ="padding:5px;">
							<%=Html.TextBox("Product.ContactMSN","", new { style = "width: 200px; height:20px;" })%>
						</td>
						<td class="key">Skype:</td>
						<td style ="padding:5px;">
							<%=Html.TextBox("Product.ContactSkype",NicSkype,new { style = "width: 200px; height:20px;" })%>
						</td>
					</tr>
					<tr>
						<td class="key">Công ty:</td>
						<td style ="padding:5px;" colspan="3">
							<%=Html.TextBox("Product.Company", Companys, new { style = "width: 600px; height:20px;" })%>
						</td>
					</tr>
					<tr>
						<td class="key">Địa chỉ:</td>
						<td style ="padding:5px;" colspan="3">
							<%=Html.TextBox("Product.ContactAddress",Address, new { style = "width: 600px; height:20px;" })%>
						</td>
					</tr>
                </tbody>
            </table>
            </fieldset>
      
            <table class="admintable" width="100%">
                <tbody>
                    <tr>
                        <td colspan="2" align="center">
                            <%= Html.HiddenFor(m=>m.Product.Longitude) %>
                            <%= Html.HiddenFor(m=>m.Product.Latitube) %>
                            <%= Html.HiddenFor(m=>m.Product.ImagePath) %>                            
                            <input type="hidden" id="ProductAttributeValue" name="ProductAttributeValue" value="" />
                        </td>
                    </tr>
                </tbody>
            </table>
        <table class="admintable" width="100%">
                <tbody>
                    <tr>
                        <td colspan="2" align="center">
                            <input type="hidden" name="lat" id="lat" value="" />
                            <input type="hidden" name="log" id="log" value="" />
                            <input type="submit" id="btnSave" value="Thêm mới" onclick="return check_extension('ImagePaths','btnSave');" />                            
                        </td>
                    </tr>
                </tbody>
            </table>
    <%}
      } %>
    <script type="text/javascript">
    	$(document).ready(function() {
    	    $("#adminForm").validate();
    		$("#Product.ContactEmail").change(function() {
    		    $("#Product.ContactEmail").rules("add", {
    				"Email": "true",
    				messages: {
    					"Email": "Bạn phải nhập theo định dang Email"
    				}
                });
                $("#Product.Cost").keyup(function() {
                    if ($("#Product.Cost").val() <= 0 || $("#Product.Cost").val() > 9999) {
                        messages: 
                        {
                            "Bạn phải nhập theo định dang Email"
                        }
                        return false;
                    }
                });
                });
           });    
    </script>

    <script type="text/javascript">
        $(document).ready(function() {
            $("#projectTabs").tabs();
            $("#Product_CityID").unbind("change").change(function() {
                var val = $("#Product_CityID").val();
                if (val == "" || val == '' || val == undefined)
                    return false;
                AjaxChange("#Product_CityID", "#Product_DistrictID", "/AjaxData/GetDistrict/");
            });

            $("#Product_DistrictID").unbind("change").change(function() {
                var val = $("#Product_DistrictID").val();
                if (val == "" || val == '' || val == undefined)
                    return false;
                AjaxChange("#Product_DistrictID", "#Product_ProjectID", "/AjaxData/GetProjectByDistrict/");
            });

            $("#Product_TypeID").unbind("change").change(function() {
                var val = $("#Product_TypeID").val();
                if (val == "" || val == '' || val == undefined)
                    return false;
                AjaxChange("#Product_TypeID", "#Product_CatID", "/AjaxData/GetProductCategoryByType/");
            });

            $("#OpenProductAttributeEx").unbind("click").click(function() {
                $("#OpenProductAttributeEx").css("display", "none");
                $("#productAttributeEx").css("display", "block");
            });
        });

        function CheckAndUncheck(id) {
            $("tr td input[id='" + id + "']:checked").each(function() {
                var strParam = $("#ProductAttributeValue").val() + ";" + id;
                $("#ProductAttributeValue").val(strParam);
            });

            $("tr td input[id='" + id + "']:unchecked").each(function() {
                var paramContext = $("#ProductAttributeValue").val();
                paramContext = paramContext.replace(";" + id, "");
                $("#ProductAttributeValue").val(paramContext);
            });
        }
    </script>
    <script type="text/javascript">
        var fileIndex = 1;
        var hash = { '.jpg': 1, '.png': 1, '.gif': 1};
        function check_extension(filename, submitId) {
            var re = /\..+$/;
            var ext = filename.match(re).toString().toLowerCase();
            var submitEl = document.getElementById(submitId);
            var btnAddFile = document.getElementById("btnAddFile");
            
            if (hash[ext]) {
                submitEl.disabled = false;
                btnAddFile.disabled = false;
                return true;
            } else {
                alert("Định dạng file là không được phép");
                submitEl.disabled = true;
                btnAddFile.disabled = true;
            }
        };
        function AddFile() {
            fileIndex++;
            if (fileIndex <= 6) {
                var tag = "<td><input id='fileInput" + fileIndex.toString() + "' name='fileInput" + fileIndex.toString() + "' type=\"file\" size='25'  onchange=\"check_extension(this.value,'btnSave');\" /></td>";
                var row = "<tr>" + tag + "</tr>";
                $("#frmFile").append(row);
            } else {
                alert("Bạn chỉ được phép gửi tối đa 6 ảnh!");
            }
        };
    </script>
</asp:Content>
